<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>学生来帮忙</title>
</head>
<body>
	<?php 
		 require_once ".\system\dbConn.php";
    require_once('head.php');
      $sql="select count(0) as count from demand where ischeck=0";
		//若果点击了搜索提交按钮，sql语句要改变
		
		if (isset($_GET["key"])) {
			$key=trim($_GET["key"]);
			$sql=$sql." and name like '%{$key}%'";
		}
		if (isset($_GET["type"])) {
			$type=trim($_GET["type"]);
			if($type!=""){
				$sql=$sql." and type=$type";
			}
		}
		if (isset($_GET["time"])) {
			$time=trim($_GET["time"]);
			if($time!=""){
				$sql=$sql." and time=$time";
			}
		}

		$result=mysqli_query($link,$sql);
//结果集
		$tempRow=mysqli_fetch_assoc($result);
		$num=$tempRow["count"];

		$rowprepage=5;//每页条数
		if (!isset($_GET["page"])) {
			$page=1;
		}else{
			$page=$_GET["page"];
		}
		if ($num%$rowprepage==0) {
			$totalpages=$num/$rowprepage;//总共多少页
		}else{
			$totalpages=ceil($num/$rowprepage);
		}
		$start=($page-1)*$rowprepage;//每页起始编号
		
		$sql0 = str_replace("count(0) as count","*",$sql)." limit $start,$rowprepage ";
		$result0=mysqli_query($link,$sql0);
//每页结果集
    ?>


    <div style="margin-top: 45px;" id="select">
		<table border="3" style="margin-left: 425px;border-style: dashed;border-color:#191970" cellspacing="20" cellpadding="20">
			<tr>
				<td>
					<p class="nav" style="margin:10px auto; font-size: 20px" >
					<span style="font-weight:bold;">任务类型：</span>
					  <span id="search-type-default" class="search-item">全部</span>
					  <span id="search-type-0" class="search-item">寻找失物</span>
					  <span id="search-type-1" class="search-item">物品借用</span>
					  <span id="search-type-2" class="search-item">疑难解答</span>
					  <span id="search-type-3" class="search-item">修理电脑</span>
					</p>
				</td>
			</tr>
			<tr>
				<td>
					<p class="nav" style="margin:10px auto; font-size: 20px" >
					<span style="font-weight:bold;">任务时限：</span>
				  	<span id="search-time-default" class="search-item">全部</span>
					<span id="search-time-0" class="search-item">5min之内</span>
					<span id="search-time-1" class="search-item">5~15min</span>
					<span id="search-time-2" class="search-item">15~30min</span>
					<span id="search-time-3" class="search-item">一天以内</span>
					<span id="search-time-4" class="search-item">一周以内</span>
				</p>
				</td>
			</tr>	
		</table>
	</div>



	<div style="width: 75%;margin:20px auto;">
		<div class="col-md-12">
		<div class="row">
		<div class="col-md-12">
			<button type="button" class="btn btn-dark"data-toggle="modal" data-target="#demand" style="float:right;margin-right:50px;">发布任务</button>
		</div>
		</div>
		<?php 		if ($num==0){
			echo "没有找到符合条件的任务";
			
		} else{ ?>
		<div class="row" style="margin-top:20px;margin-bottom:10px;">
    		<table class="table table-hover" >	
    		
			<thead class="thead-dark">
				<th>序号</th>
				<th>任务名称</th>
				<th>任务详情</th>
				<th>任务类型</th>
				<th>时限</th>
				<th>报酬</th>
				<th>发布时间</th>
				<th>发布人</th>
				<th>操作</th>
			</thead>


		<?php
		$i=0;
		while ($row=mysqli_fetch_assoc($result0)) {	
			$i++;
		?>
			<tr>
				<td><?php echo $i+($page-1)*5; ?></td>
				<td><?php echo $row["name"]; ?></td>
				<td><?php echo $row["details"]; ?></td>
				<td><?php 
					if ($row["type"] == 0) {
					 	echo "寻找失物";
					 } elseif ($row["type"] == 1) {
					 	echo "物品借用";
					 }elseif ($row["type"] == 2) {
					 	echo "疑惑解答";
					 }elseif ($row["type"] == 3) {
					 	echo "电脑修理";
					 }
				?></td>
				<td><?php 
					if ($row["time"] == 0) {
				 	echo "5min之内";
				 } elseif ($row["time"] == 1) {
				 	echo "5~15min";
				 }elseif ($row["time"] == 2) {
				 	echo "15~30min";
				 }elseif ($row["time"] == 3) {
				 	echo "一天以内";
				 }elseif ($row["time"] == 4) {
				 	echo "一周以内";
				 }
				 ?></td>
				<td><?php echo $row["money"]."元"; ?></td>
				<td><?php echo $row["uploaddate"]; ?></td>
				<td><?php echo $row["uploadusers"]; ?></td>
				<td>
					<?php 
							if(isset($_SESSION["username"])){
							$uploadusers=$_SESSION["username"];
					?>
					<?php  
						if ($row["isaccept"]==1) {
					?>
								<h6>已接受</h6>
					<?php }else{ ?>
							<a href="accept.php?id=<?php echo $row["id"]; ?>&aname=<?php echo $row["name"]; ?>">接受任务</a>
					<?php } ?>	
					<?php
					}
					else{
					?>
							<h6 class="intro-text text-center"><a a href="#" data-toggle="modal" data-target="#login2"">登录</a>后接受任务</h6>
					<?php
					}
					?>			
				</td>
			</tr>
		<?php
		}
	?>

	
		</table>

		</div>
		<nav style="text-align: center ;margin-left: 500px">
			<ul class="pagination"  >
				<?php
				// echo "<li>共有".$num."条记录,共分了".$totalpages."页"."&nbsp;</li>";
				echo "<li class=\"page-item\"><a class=\"page-link\" href=\"?page=1\">首页</a></li>";
				if ($page > 1) {
					echo "<li class=\"page-item\"><a class=\"page-link\" href=\"?page=".($page-1)."\">上页</a></li>";
				}
				
				//第i页的超链接
				for ($i=1; $i<=$totalpages; $i++){ 
					echo "<li class=\"page-item\"><a class=\"page-link\" href=\"?page=$i\">$i</a></li>";
				}
				//尾页下一页
				if ($page < $totalpages) {
					echo "<li class=\"page-item\"><a class=\"page-link\" href=\"?page=".($page+1)."\">下页</a></li>";
				}
				echo "<li class=\"page-item\"><a class=\"page-link\" href=\"?page=$totalpages\">尾页</a></li>";
				?>
			</ul>
		</nav>	
	</div>
	<?php } ?>
</div>
<div class="modal fade" id="demand" tabindex="-1" role="dialog" aria-labelledby="demand" aria-hidden="true">
	<div class="modal-dialog modal-dialog-centered" role="document">
	  <div class="modal-content">
	    <div class="modal-header">
		  <h5 class="modal-title" id="demand">新任务发布</h5>
	      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>		        
	    </div>
	    <div class="modal-body">
		<form class="form-horizontal">
			  <div class="form-group row">
			    <label for="inputName" class="col-md-2 col-form-label">任务名:</label>
			    <div class="col-md-10">
			      <input id="damandName" type="text" class="form-control" name="name" placeholder="任务名">
			    </div>
			  </div>

			  <div class="form-group row">
	            <label for="type" class="col-md-2 col-form-label">类&nbsp&nbsp&nbsp型:</label>
	            <div class="col-md-10">
	            	<select id="selectType" class="form-control" name="type">
			     				<option value="0">寻找失物</option>
	             		<option value="1">物品借用</option>
	             		<option value="2">疑惑解答</option>
	             		<option value="3">电脑修理</option>
					</select>
	            </div>
	          </div>

			  <div class="form-group row">
			    <label for="inputAddress" class="col-md-2 col-form-label">地&nbsp&nbsp&nbsp点:</label>
			    <div class="col-md-10">
			      <input type="text" class="form-control" id="inputAddress" name="address" placeholder="地点">
			    </div>
			  </div>

			  <div class="form-group row">
			    <label for="inputTime" class="col-md-2 col-form-label">时&nbsp&nbsp&nbsp限:</label>
			    <div class="col-md-10">
			     	<select id="selectTime" class="form-control" name="time">
			     		<option value="0">5min之内</option>
	             		<option value="1">5~15min</option>
	             		<option value="2">15~30min</option>
	             		<option value="3">一天以内</option>
	             		<option value="4">一周以内</option>
					</select>
			    </div>
			  </div>

			   <div class="form-group row">
			    <label for="inputM" class="col-md-2 col-form-label">报&nbsp&nbsp&nbsp酬：</label>
			    <div class="col-md-10">
			      <input type="text" class="form-control" id="inputM" name="money" placeholder="报酬">
			    </div>
			  </div>

			  <div class="form-group row">
	            <label for="inputdetails" class="col-md-2 col-form-label">详&nbsp&nbsp&nbsp情:</label>
	            <div class="col-md-10">
	            	<textarea name="details" id="inputdetails" cols="50" rows="5" placeholder="任务详情"></textarea>
              	</div>
			  </div>
			  <div class="modal-footer">
			  	<button id="demandBtn"  class="btn btn-primary btn-lg active " >提交</button>
			  </div>
			</form>	
	    </div>
	  </div>
	</div>
</div> 


<div class="modal fade" id="login2" tabindex="-1" role="dialog" aria-labelledby="login2" aria-hidden="true">
	<div class="modal-dialog modal-dialog-centered" role="document">
	  <div class="modal-content">
	    <div class="modal-header">
				<h5 class="modal-title" id="login">登录</h5>
	      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>		        
	    </div>
	    <div class="modal-body">
			<form class="form-horizontal" id="loginForm" action="doUserLog.php" method="post">
			  <div class="form-group">
			    <!-- <label for="inputUsername" class="col-md-4 control-label">用户名：</label> -->
			    <div class="col-md-12">
			      <input type="text" class="form-control" id="inputUsername" name="username" placeholder="用户名">
			    </div>
			  </div>
			  <div class="form-group">
			    <!-- <label for="inputPassword3" class="col-md-4 control-label">密码：</label> -->
			    <div class="col-md-12">
			      <input type="password" class="form-control" id="inputPassword3" name="password" placeholder="密码">
			    </div>
			  </div>
			  <div class="form-group">
			    <div class="col-sm-offset-2 col-sm-10">
			      <button id="loginBtn" type="submit" class="btn btn-default">登录</button>
			    </div>
			  </div>
			</form>
	    </div>
	  </div>
	</div>
</div>   
<script>
$(function(){
	//初始化搜索参数
	let searchType =  localStorage.getItem("searchType") || "search-type-default"
	let searchTime =  localStorage.getItem("searchTime") || "search-time-default"
	let url = location.href.split('?')[0] + "?page=1&_=" + Math.round(Math.random()*100000)
	$("#demandBtn").click(function(e){ 
		e.preventDefault();
		$.ajax({
			url:"http://localhost/studentMutualHelp/doDemand.php",
			type:"post",
			data:{
				name:$("#damandName").val(),
				type:$("#selectType").val(),
				address:$("#inputAddress").val(),
				time:$("#selectTime").val(),
				money:$("#inputM").val(),
				details:$("#inputdetails").val()
			},
			success:function(data){
				console.log(data);
				if(data){
					alert("添加成功");
					location.reload();
				}
				else{
					alert("添加失败，未知错误");
				}
			},
			error:function(err){
				alert(err);
			}
		});
	})	
	$("#"+searchType).attr("class","search-item-selected")
	$("#"+searchTime).attr("class","search-item-selected")
	$("span[id^='search-type-']").click(function(e){
		$("span[id^='search-type-']").attr("class","search-item")
		$("#"+e.target.id).attr("class","search-item-selected")
		localStorage.setItem("searchType",e.target.id)	
		
		var time = $("span[id^='search-time-'][class='search-item-selected']").attr("id")
		if(time != "search-time-default"){
			url = url + "&time=" + time.replace("search-time-","")
		}
		if(e.target.id != "search-type-default"){
			url = url + "&type=" + e.target.id.replace("search-type-","")
		}
		location.href=url
	})
	$("span[id^='search-time-']").click(function(e){
		$("span[id^='search-time-']").attr("class","search-item")
		$("#"+e.target.id).attr("class","search-item-selected")
		localStorage.setItem("searchTime",e.target.id)

		var type = $("span[id^='search-type-'][class='search-item-selected']").attr("id")
		if(type!= "search-type-default"){
			url = url + "&type=" + type.replace("search-type-","")
		}
		if(e.target.id != "search-time-default"){
			url = url + "&time=" + e.target.id.replace("search-time-","")
		}
		location.href=url
	})
})


</script>
<style >
	.nav a{ 
		padding:0 30px;
	 }
	 .search-item{
		font-size:20px;
		margin-left:10px;
		margin-right:10px;
	 }
	 .search-item-selected{
		font-size:20px;
		margin-left:10px;
		margin-right:10px;
		color:#ff6600;
	 }
	  table { table-layout:fixed; word-break: break-all; word-wrap: break-word; }  
	 body{
	 	 background: #ffffff url(./assets/list.png);
	 	 background-size:100%;
	 
	 }
</style>
</body>
</html>